<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>jquery-4-prev/prevAll选择器</title>
    <script src="js/jquery-3.4.1.min.js"></script>
    <style>
        /* div>p{
            color: red;
        } */
    </style>
    <script>
        $(function () {
            //prev选择器：只获取某节点前一个同级DOM对象
            $('.box1').prev('div').css('color', 'blue');
            

            //prevAll选择器：获取节点前所有同级DOM对象
            $('p').prevAll('span').css('color', 'red');

        });
    </script>
</head>

<body>
    <div>
        next1选择器
    </div>
    <div>
        next2选择器
    </div>
    <div>
        next3选择器
    </div>
    <div class="box1">
        next4选择器
    </div>

    <span>nextAll选择器1</span>
    <span>nextAll选择器2</span>
    <p>nextAll选择器3</p>
</body>

</html>